<template>
  <div style="border: 1px solid #bdbdbd" class="pend-business">
    <div class="text">
      <span>待处理事物</span>
    </div>
    <el-row :gutter="24" class="pend-el-row">
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>待审核商品</span><span>({{ getStore.noReviewProduct }})</span>
        </div></el-col
      >
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>已上架商品</span><span>({{ getStore.unShelveProduct }})</span>
        </div></el-col
      >
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>待发货商品</span><span>({{ pend.noShipmentsOrder }})</span>
        </div></el-col
      >
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>技术服务费总和</span
          ><span>({{ pend.technologyIncomeAmount }})</span>
        </div></el-col
      >
    </el-row>
    <el-row :gutter="24" class="pend-el-row">
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>已驳回商品</span><span>({{ getStore.shelveProduct }})</span>
        </div></el-col
      >
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>已下架商品</span
          ><span>({{ getStore.hasBeenRejectedProduct }})</span>
        </div></el-col
      >
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>已发货商品</span><span>({{ pend.shipmentsOrder }})</span>
        </div></el-col
      >
      <el-col :span="6"
        ><div class="pend-el-col">
          <span>平台收益总和</span><span>({{ pend.platformEarnings }})</span>
        </div></el-col
      >
    </el-row>
  </div>
</template>
<script>
import { pending, getStorePending } from "@/api/wel";

export default {
  data() {
    return {
      pend: {},
      getStore: {},
    };
  },
  created() {
    this.getPending();
    this.getStorePend();
  },
  methods: {
    getPending() {
      pending({type: 1}).then((res) => {
        this.pend = res.data.data;

      });
    },
    getStorePend() {
      getStorePending({type: 1}).then((res) => {
        this.getStore = res.data.data;
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.pend-business {
  height: 200px;
  width: 100%;
  .text {
    display: flex;
    justify-content: space-between;
    padding: 20px 20px 20px 20px;
    border-bottom: 1px solid #bdbdbd;
  }
  .pend-el-row {
    padding: 20px 20px 5px 20px;
    .pend-el-col {
      width: 70%;
      display: flex;
      justify-content: space-between;
      border-bottom: 1px solid #bdbdbd;
    }
  }
}
</style>
